
function $(selector) {
    return document.querySelector(selector)
}
class Fdj {
    constructor() {
        this.box = $('.img-box')
        this.big = $('.copy-box')
        this.addUl = $('.add-cart-ul li')
        this.des = $('.des-img')
        this.moveB = $('.move-box')
        this.out = $('.left')
        this.picS = $('.price-start')
        this.picE = $('.price-end')
        this.imgC = $('.img-color')
        this.addBtn = $('.add-num')
        this.goodsNum = $('.goods-number')
        this.redBtn = $('.reduce-nmu')
        this.addCart = $('.addcart')
        // console.log(addCart)
        this.init()
    }
    init() {
        this.getData()
        this.requestX()
        this.clickA()
    }
    getData() {
        let str = location.search
        let obj = {}
        str = str.slice(1)
        let arr = str.split('=')
        obj[arr[0]] = arr[1]
        return obj
    }
    requestX() {
        pAjax({
            url: '/libs/data/goods.json'
        })
            .then((res) => {
                let dataGoods = JSON.parse(res)
                dataGoods = dataGoods.slice(180, 230)
                let obj = this.getData()
                let data = dataGoods.find(function (item) {
                    return item.goods_id == obj.id
                })
                // console.log(data);
                this.renderX(data)
                this.clickA(data)

            }
            )
    }

    renderX(data) {
        this.box.innerHTML += `
               <img src="${data.img_small_logo}" >
            `
        this.big.innerHTML += `
                <img src="${data.img_big_logo}" class="big-img">
            `
        this.des.innerHTML += `
        <li><img src="${data.img_small_logo}" alt=""></li>
        <li><img src="${data.img_small_logo}" alt=""></li>
        <li><img src="${data.img_small_logo}" alt=""></li>
        <li><img src="${data.img_small_logo}" alt=""></li>
        <li><img src="${data.img_small_logo}" alt=""></li>
        `
        this.picS.innerText = `￥${data.current_price}`
        this.picE.innerText = `${data.price}`
        this.imgC.src = data.img_small_logo
        this.img = $('.copy-box img')
        this.over()
        this.move()
        this.out1()
    }
    over() {
        this.box.onmouseover = () => {
            this.moveB.style.display = 'block'
            this.big.style.display = 'block'
        }
    }
    move() {
        this.box.onmousemove = (e) => {
            let x = e.pageX - this.out.offsetLeft - this.moveB.offsetWidth / 2
            let y = e.pageY - this.out.offsetTop - this.moveB.offsetHeight / 2
            if (x <= 0) {
                x = 0
            } else if (x >= this.box.offsetWidth - this.moveB.offsetWidth) {
                x = this.box.offsetWidth - this.moveB.offsetWidth
            }
            if (y <= 0) {
                y = 0
            } else if (y >= this.box.offsetHeight - this.moveB.offsetHeight) {
                y = this.box.offsetHeight - this.moveB.offsetHeight
            }
            this.moveB.style.left = x + 'px'
            this.moveB.style.top = y + 'px'
            let w = -x * (this.img.offsetWidth - this.big.offsetWidth) / (this.box.offsetWidth - this.moveB.offsetWidth)
            let h = -y * (this.img.offsetHeight - this.big.offsetHeight) / (this.box.offsetHeight - this.moveB.offsetHeight)

            this.img.style.left = w + 'px'
            this.img.style.top = h + 'px'
        }
    }
    out1() {
        this.box.onmouseout = () => {
            this.moveB.style.display = 'none'
            this.big.style.display = 'none'
        }
    }
    //加减数量···································
    clickA(data) {
        this.addBtn.onclick = () => {
            let list =JSON.parse(localStorage.getItem('cart'))  ||  []
            if(!list.length){
            let num = this.goodsNum.value - 0
            num++
            let newNum = Number(data.cart_number + num)

            if (newNum > data.goods_number) {
                num--
                alert('亲爱滴，抱歉库存不够哟~')
            }
            this.goodsNum.value = num
        }else{
            let num = this.goodsNum.value - 0
            num++
            let newNum = Number(list[0].cart_number + num)

            if (newNum > data.goods_number) {
                num--
                alert('亲爱滴，抱歉库存不够哟~')
            }
            this.goodsNum.value = num
        }
        }

        this.redBtn.onclick = () => {
            let list =JSON.parse(localStorage.getItem('cart'))  ||  []
            if(!list.length){
            let num = this.goodsNum.value
            num--
            let newNum = Number(data.cart_number + num)
            if (num < 1) {
                num = 1
            }
            if (newNum > data.goods_number) {
                num=data.goods_number-data.cart_number
                this.goodsNum.value = num
            }
            this.goodsNum.value = num
        }else{
            let num = this.goodsNum.value
            num--
            let newNum = Number(list[0].cart_number + num)
            if (num < 1) {
                num = 1
            }
            if (newNum > data.goods_number) {
                num=data.goods_number-list[0].cart_number
                this.goodsNum.value = num
            }
            this.goodsNum.value = num
        }

        }
//开始加入购物车····························································
        this.addCart.onclick = () => {
           
            let num = this.goodsNum.value - 0
            data.cart_number += num
            if (num> data.goods_number ||data.cart_number > data.goods_number) {
                alert('亲爱滴，抱歉库存不够哟~')
                data.cart_number -= num
            }
            else{
                 let list =JSON.parse(localStorage.getItem('cart'))  ||  []
                let id= data.goods_id-0
                if(!list.length){

                    list.push(data)
                    localStorage.setItem('cart',JSON.stringify(list))
                }else{
                    let res =list.some(item=>{
                        return item.goods_id==id
                    })
                    if(!res){
                        list.push(data)
                        localStorage.setItem('cart',JSON.stringify(list))
                    }else{
                        let index=list.findIndex(function (item) {
                            return item.goods_id == data.goods_id                            }
                )
                        list[index].cart_number += num
                        localStorage.setItem('cart',JSON.stringify(list))
                    }                  
                }
            }
        }
    }
}
new Fdj()